<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
</head>

<body>
  <input type="text" id="txt">
  <div id="show"></div>
  <button id="btn">点击反向</button>
  <script>
    // 字符串方法
    var str = "我们都是追梦人,千上万水,来报道";
    // 8 slice(start,end)提取字符串的片段，并以新的字符串中返回被提取的部分
    // 留头不留尾部
    document.write(str.slice(3, 6) + "<br/>");//是追梦
    //09 split() 	通过特定字符把字符串分割为字符串数组  和join连接数组为true
    var arr = str.split();
    var arr1 = str.split(",");
    var arr2 = str.split("");
    console.log(arr)
    console.log(arr1)
    console.log(arr2)
    // 案例反向输出字符串
    // 取出元素
    var btn = document.getElementById("btn")
    var txt = document.getElementById("txt");
    var show = document.getElementById("show");
    // 给按钮绑定点击事件
    btn.onclick = function () {
      var val = txt.value;//获取输入框的值
      // 将输入框的值 字符串分割成数组split("")  调用数组的颠倒方法reverse()  连接会字符串join()
      var newstr = val.split("").reverse().join("");
      show.innerHTML = newstr;
    }
    //
    var str = "2020-10-30,14:12"
    // 字符串截取
    // 10 substr(index,num)  从下标位置截取num几个字符 
    var date = str.substr(str.lastIndexOf("-") + 1, 2)
    console.log(date)
    var hour = str.substr(str.indexOf(",") + 1, 2)
    console.log(hour)
    // substr 传一个参数  从下标位置 截取到最后
    console.log(str.substr(5))
    //11 substring(start,end)从开始下标 截取到结束下标
    // 留头不留尾
    console.log(str.substring(3, 5))
    console.log(str.substring(str.lastIndexOf("-") + 1, str.indexOf(",")))
    // 12. 把字符串转大写 toUpperCase()
    var str8 = "dsahfkhDAGFASJdafas";
    console.log(str8.toUpperCase())
    // 13.把字符串转小写 toLowerCase()
    console.log(str8.toLowerCase())
    //14.trim()  去除字符串的首尾空格
    var str9 = "   asdfd df sf sf     "
    console.log(str9.trim())
    //15. replace(要替换的,替换字符) 方法用于在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串。
    var str10 = "阿斯蒂芬阿斯蒂芬TMD打发撒旦法";
    document.write(str10.replace("TMD", "***"))
    //16.search() 查找字符串 匹配会第一次出现的下标 为找到返回-1
    console.log(str10.search("打发"))
    console.log(str10.search("打发你"))
    //17 match(/reg/) 匹配符合规则的字符串 符合规则的字符串 会放到数组中
    var str12 = "dsafjshdfkhaskdfhkashdfkj";
    console.log(str12.match(/a/g))   // 正则 匹配a   g 全局匹配  匹配多次
  </script>
</body>

</html>